<template>
  <div>
    <r-search
      ref="search"
      :searchData="searchData"
      :searchForm="searchForm"
      :searchHandle="searchHandle"
      :inline="true"
    />

    <r-table
      :isPagination="true"
      :isHandle="true"
      :tableData="tableData"
      :tableCols="tableCols"
      :tablePage="pagination"
      :loading="tableLoading"
      :tableHandles="tableHandles"
      :isSelection="false"
      @refresh="page()"
    />
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      searchData: {
        nickName: "",
        phone: "",
        state: ""
      },
      searchForm: [
        {
          type: "input",
          placeholder: "Order Nnumber",
          prop: "nickName",
          width: 200
        },
        { type: "input", placeholder: "UserPhone", prop: "phone", width: 200 },
        { type: "date", placeholder: "Payment时间", prop: "phone", width: 200 },
        {
          type: "select",
          placeholder: "订单Status",
          prop: "state",
          width: 200,
          options: [
            { label: "正常", value: 35 },
            { label: "Forbidden", value: 34 }
          ]
        }
      ],
      searchHandle: [
        { type: "primary", label: "Search", handle: e => this.getData() }
        // {type:'primary',label:'Reset', handle: e => this.elFormSubmit(),}
      ],
      tableLoading: false,
      tableData: [{}],
      tableCols: [
        { label: "Order Nnumber", prop: "id" },
        { label: "Withdrawal Amount", prop: "nickName" },
        { label: "Submission Time", prop: "consumptionMoney" },
        { label: "Username", prop: "headimgurl" },
        { label: "Phone", prop: "phone" },
        { label: "到账方式", prop: "topUpMoney" },
        { label: "订单Status", prop: "isVip_des" }
      ],
      tableHandles: [
        {
          label: "Export",
          type: "primary",
          handle: e => this.elFormVisible()
        }
      ],
      pagination: { limit: 10, offset: 1, total: 1 },

      checkBox: []
    };
  },
  created() {},
  mounted() {
    this.getData();
  },
  methods: {
    userDetailsCall() {
      this.userDetailsData.show = false;
    },
    async usersys_updata(row) {
      var res = await this.apis.usersys_updata({
        id: row.id,
        state: row.state == 34 ? 35 : 34
      });
      this.getData();
    },
    async getData() {
      var res = await this.apis.getUserList({
        phone: this.searchData.phone,
        nickName: this.searchData.nickName,
        state: this.searchData.state,
        page: this.pagination.offset,
        limit: this.pagination.limit
      });
      console.log(res);
      var list = res.data.list || [];

      list.map(res => {
        res.btn_des = res.state == 34 ? "Enable" : "Forbidden";
        res.isVip_des = res.isVip == 0 ? "否" : res.isVip == 1 ? "是" : "";
      });

      this.tableData = list;
      this.pagination.total = res.data.total;
    },
    page() {
      this.getData();
    }
  }
};
</script>

<style scoped lang="scss"></style>
